{%extends "base.html"%}
{% block scripts %}
	<script type="text/javascript">
		$(document).ready(function(){
			if ( $.browser.msie ){
				if ( $.browser.version == '6.0' ){
					alert( "哥们儿 还在用 IE6 啊…… 该换个浏览器啦……" );
				} else {
					alert( "哥们儿 还在用 IE 啊…… 可以考虑换个浏览器啦…… 这个在线程序是基于 HTML5 的啊…… IE 对 HTML5 支持不好……" );
				};
			};

			$(".plain-code-slide").click(function(){
				$("#plaincode_panel").slideToggle("slow");
				$(this).toggleClass("active");
			});

			{% if rendered_code %}
				$(".html-code-slide").click(function(){
					$("#htmlcode_panel").slideToggle("slow");
					$(this).toggleClass("active");
					//$(this).parents(".panel").animate({ opacity: "hide" }, "slow");	});
				});
				$(".html-code-slide").click();
				$(".plain-code-slide").click();
			{% endif %}
			
			$("#plain_code").keyup(function(){
				if ( !ifrealtime() ){ return; }

				$("#status").html("加载中……");

				$.ajax({
					url: '/getcodehtml'  ,
					type: 'POST',
					
					data: {
						"showlinenumber": ifshowlinenumber(),
						"code_lang": $("#code_lang").val(),
						"plain_code": $("#plain_code").val()
					},

					timeout: 5000,
					error: function(){
						$("#rendered_code_div").html("加载页面失败！");
						$("#status").html("加载页面失败");
					},
					success: function(html){
						$("#rendered_html_code").val(html);
						$("#rendered_code_div").html(html);
						$("#status").html("就绪");
					} // success
				}); // $.ajax
			}); // $("#plain_code").keyup()
		}); // $(document).ready()
	</script>

	<!-- Google Analytics 统计代码 -->
	<script type="text/javascript"> 
		var _gaq = _gaq || [];
			_gaq.push(['_setAccount', 'UA-17147150-1']);
			_gaq.push(['_setDomainName', '.appspot.com']);
			_gaq.push(['_trackPageview']);

		(function() {
			var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
			ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
			var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
		})();
	</script>

{% endblock %}

{% block block_div %}

	<form action="/mark" method="post">

		<select class="" name="code_lang" id="code_lang">
			<option value="">请选择对应的语言</option>
			<!--
			<option value="cpp" selected="selected">C++</option>
			<option value="python">python</option>
			-->
			{{ code_renderers }}
		</select>

		<div>

		<div id="plaincode_panel" style="display: block;">
		<br/>
			<!-- 下面 textarea 的 cols 属性已经无效了 -->
			<textarea name="plain_code" id="plain_code" rows="12" cols = "60" style="width:90%;margin:5px 0;overflow:auto">{% if not plain_code %}#include &lt;iostream&gt;
using namespace std;

int main()
{
	/* 这里是 C++ 的代码 请在上面语言框中选择 C++ 语言 */
	cout &lt;&lt; &quot;Hello world!&quot; &lt;&lt; endl; //show message

	return 0;
}{% else %}{{ plain_code }}{% endif %}</textarea> <!-- id="plain_code" -->
		<br>
		{% if rendered_code %}
			<!--input type="checkbox" id="realtime" value ="realtime" checked = "checked">实时更新</input><br/-->
		{% endif %}
		
		{% if rendered_code %}
			<!--input type="checkbox" id="showlinenumber" value ="checked" checked = "checked">显示行号</input><br/-->
		{% endif %}
		<input type="submit" value="进行标记">
		{% if rendered_code %}
			<a href="javascript:$('#plain_code').keyup()();">进行标记</a>
		{% endif %}
		
		<br/>
		</div> <!-- id="plaincode_panel" -->
		
		{% if rendered_code %}
		<div class="message">
			<span class="plain_code_slide"><a href="javascript:void(0);" class="plain-code-slide active">显示/隐藏原始代码</a></span>
		</div>
		{% endif %}
		</div>
	</form>
	
	{% if rendered_code %}
		<div id = "rendered_code_div" style="font-family: &quot;[object HTMLOptionElement]&quot;,&quot;monospace&quot;; color: rgb(0, 0, 0);">
			{{ rendered_code }}
		</div> <!-- id="rendered_code_div" -->
		
		<div class="tip" id = "status">就绪</div><br/>
		
		
		<div class="message" id="htmlcode_panel" style="display: block;">
			标记代码：<br>
			<textarea id = "rendered_html_code" name="" rows="12" style="width:90%;margin:5px 0;overflow:auto">{{ rendered_html_code }}</textarea>
			
			</div>
			<div class="message">
				<span class="html_code_slide"><a href="javascript:void(0);" class="html-code-slide active">显示/隐藏 HTML 代码</a></span>
			</div>
		</div> <!-- id="htmlcode_panel" -->
		
	{% endif %}

{% endblock %}

